h2. Prototyping with Quick Forms: Rendered HTML
<br>

<h4>Rendered HTML</h4>

<pre>
<form action="/books" class="formtastic book" id="new_book" method="post">

<div style="margin:0;padding:0;display:inline">
    <input name="authenticity_token" type="hidden" value="718WaH76RAbIVhDlnOidgew62ikn8IUCOyWLEqjw1GE=" />
</div> 

<fieldset class="inputs">
<ol>
<li class="select required" id="book_publisher_input">
<label for="book_publisher_id">
    Publisher<abbr title="required">*</abbr>
</label>
<select id="book_publisher_id" name="book[publisher_id]">
    <option value=""></option> 
    <option value="1">The Pragmatic Bookshelf</option> 
    <option value="2">sitepoint</option> 
    <option value="3">O'Reilly</option>
</select>
</li>

<li class="string required" id="book_title_input">
<label for="book_title">
    Title<abbr title="required">*</abbr>
</label>
    <input id="book_title" maxlength="255" name="book[title]" size="50" type="text" />
</li>

<li class="string required" id="book_rating_input">
<label for="book_rating">
   Rating<abbr title="required">*</abbr>
</label>
    <input id="book_rating" maxlength="255" name="book[rating]" size="50" type="text">
</li>

<li class="text required" id="book_description_input">
<label for="book_description">
    Description<abbr title="required">*</abbr>
</label>
    <textarea cols="40" id="book_description" name="book[description]" rows="20"></textarea>
</li>

<li class="boolean required" id="book_still_in_print_input">
<label for="book_still_in_print">
    Still in print<abbr title="required">*</abbr>
</label>
    <input name="book[still_in_print]" type="hidden" value="0" />
    <input id="book_still_in_print" name="book[still_in_print]" type="checkbox" value="1" />
</li>

<li class="date required" id="book_published_input">
<fieldset>
<legend class="label">	
<label for="book_published_1i">
    Published<abbr title="required">*</abbr>
</label>
</legend>
<ol>
<li>
<label for="book_published_1i">
    Year
</label>
    <select id="book_published_1i" name="book[published(1i)]"> 
    <option value=""></option> 
    <option value="2005">2005</option> 
    <option value="2006">2006</option> 
    <option value="2007">2007</option> 
    <option value="2008">2008</option> 
    <option value="2009">2009</option> 
    <option selected="selected" value="2010">2010</option> 
    <option value="2011">2011</option> 
    <option value="2012">2012</option> 
    <option value="2013">2013</option> 
    <option value="2014">2014</option> 
    <option value="2015">2015</option> 
    </select> 
</li>

<li>
<label for="book_published_2i">
    Month
</label>
    <select id="book_published_2i" name="book[published(2i)]"> 
    <option value=""></option> 
    <option value="1">January</option> 
    <option value="2">February</option> 
    <option selected="selected" value="3">March</option> 
    <option value="4">April</option> 
    <option value="5">May</option> 
    <option value="6">June</option> 
    <option value="7">July</option> 
    <option value="8">August</option> 
    <option value="9">September</option> 
    <option value="10">October</option> 
    <option value="11">November</option> 
    <option value="12">December</option> 
    </select> 
</li>

<li>
<label for="book_published_3i">
    Day
</label>
    <select id="book_published_3i" name="book[published(3i)]"> 
    <option value=""></option> 
    <option value="1">1</option> 
    <option value="2">2</option> 
    <option value="3">3</option> 
    <option value="4">4</option> 
    <option value="5">5</option> 
    <option value="6">6</option> 
    <option value="7">7</option> 
    <option value="8">8</option> 
    <option value="9">9</option> 
    <option value="10">10</option> 
    <option value="11">11</option> 
    <option value="12">12</option> 
    <option value="13">13</option> 
    <option value="14">14</option> 
    <option value="15">15</option> 
    <option value="16">16</option> 
    <option selected="selected" value="17">17</option> 
    <option value="18">18</option> 
    <option value="19">19</option> 
    <option value="20">20</option> 
    <option value="21">21</option> 
    <option value="22">22</option> 
    <option value="23">23</option> 
    <option value="24">24</option> 
    <option value="25">25</option> 
    <option value="26">26</option> 
    <option value="27">27</option> 
    <option value="28">28</option> 
    <option value="29">29</option> 
    <option value="30">30</option> 
    <option value="31">31</option> 
    </select> 
</li>
</ol>
</fieldset>

<li class="numeric required" id="book_isbn_number_input">
<label for="book_isbn_number">
    Isbn number<abbr title="required">*</abbr>
</label>
    <input id="book_isbn_number" name="book[isbn_number]" size="50" type="text" />
</li>

<li class="numeric required" id="book_price_input">
<label for="book_price">
    Price<abbr title="required">*</abbr>
</label>
    <input id="book_price" name="book[price]" size="50" type="text" value="0.0" />
</li>
</ol>
</fieldset> 

<fieldset class="buttons">
<ol>
<li class="commit">
    <input class="create" id="book_submit" name="commit" type="submit" value="Create Book" />
</li>
</ol>
</fieldset> 

</form>
</pre>